import React from "react";
import style from "./style.module.scss";
import nextIcon from "../../assets/images/icon/common resource/hdpi/common_information_next_n.png";
import { useNavigate } from "react-router-dom";

// 定义 查看我的病友圈发帖列表 数据类型
interface MyPatientCircleRawState {
  sickCircleId: number;
  title: string;
  detail: string;
  amount: number;
  collectionNum: number;
  commentNum: number;
  releaseTime: number;
}

interface PropsType {
  item: MyPatientCircleRawState;
}

export const MyPatientCircleItem: React.FC<PropsType> = ({ item }) => {
  const navigate = useNavigate();
  const dateTime = new Date(item.releaseTime).toLocaleDateString().split("/");
  return (
    <div className={style.myPatientCircle}>
      <div className={style.dateTime}>
        <div className={style.day}>{dateTime[2]}</div>
        <div className={style.month}>
          {dateTime[1].length === 1 ? 0 + dateTime[1] : dateTime[1]}月
        </div>
      </div>
      <div className={style.mySickCircle}>
        <div className={style.title}>{item.title}</div>
        <div className={style.detail}>{item.detail}</div>
        <div
          className={style.comments}
          onClick={() =>
            navigate(
              "/my/patient/circle/comment/list?sickCircleId=" +
                item.sickCircleId
            )
          }
        >
          <span>查看评论</span>
          <img src={nextIcon} alt="" className={style.next} />
        </div>
      </div>
    </div>
  );
};

export default MyPatientCircleItem;
